<template>
  <!-- 含有子菜单的一项 -->
  <my-sub-menu :key="data.id">
    <!-- 将内容放入men_title插槽中 -->
    <template #menu_title>
      {{ data.title }}
    </template>

    <!-- 将内容放入默认插槽中 -->
    <template v-for="c of data.children">
      <my-menu-item :key="c.id" v-if="!c.children">
        {{ c.title }}
      </my-menu-item>

      <!-- 使用重复组件 -->
      <my-re-sub-menu v-else :key="c.id" :data="c"></my-re-sub-menu>
    </template>
  </my-sub-menu>
</template>

<script>
export default {
  name: 'MyReSubMenu',
  props: ['data'],
};
</script>

<style></style>
